<template>
	<view>
		<view class="qrcode_box">
			<view class="qrcode_bg text-center" @click="preview(qrcode)">
				<image :src="qrcode" style="width: 275upx;height: 275upx;display: inline-block; vertical-align: middle;"></image>
			</view>
			<view class="invite_code text-center">
				<text style="font-size:29upx;">邀请码：{{invite_code}}</text>
			</view>
			<view class="dot">
				<text>..................</text>
			</view>
		</view>
		<view class="qrcode_text text-center">
			<text style="font-size:28upx;">分享二维码，邀请朋友一起体验健康， 还可赚取分享佣金</text>
		</view>
		<view class="button" @tap="copycode">
			<view class="save button_view text-center">
				<text class="font-md">复制邀请码</text>
			</view>
			<!-- <view class="invite button_view text-center">
				<text class="font-md">邀请好友</text>
			</view> -->
		</view>
	</view>
</template>

<script>
	import request from '@/common/lib/request.js'
	import QR from '@/common/lib/wxqrcode.js' // 二维码生成器  
	import { pathToBase64, base64ToPath } from '@/common/image-tools/index.js'
	import h5Copy from '@/js_sdk/junyi-h5-copy/junyi-h5-copy/junyi-h5-copy.js'
	export default {
		data() {
			return {
				baseUrl:request.common.baseUrl,
				qrcode:'',
				invite_code:'',
				imgPath: '',

			}
		},
		onLoad:function(option){
			this.invite_code=option.invite_code
			if(!this.invite_code){
				uni.request({
					url: request.common.baseUrl+'/api/users/userinfos',
					data: {
						token:uni.getStorageSync('keyToken')
					},
					header: {
						'Content-Type':'application/json;charset=UTF-8',
						'Content-Type':'application/x-www-form-urlencoded'
					},
					success: (res) => {
						console.log(res)
						if(res.data.code==200){
							this.invite_code=res.data.data.invite_code
							this.qrcode = QR.createQrCodeImg(this.baseUrl+'/h5/index.html#/pages/login/register?invite_code='+this.invite_code, {
								size: parseInt(300),//二维码大小
								typeNumber:8
							})
						}
					}
				});
			}else{
				this.qrcode = QR.createQrCodeImg(this.baseUrl+'/h5/index.html#/pages/login/register?invite_code='+this.invite_code, {
					size: parseInt(300),//二维码大小
					typeNumber:8
				})
			}
		},
		methods: {
			// topath(){
			// 	base64ToPath(this.qrcode)
			// 	  .then(path => {
			// 		  this.imgPath = path
			// 	  })
			// 	  .catch(error => {
			// 	    // console.error(error)
			// 	  })
			// },
			copycode(){
				let text = String(this.invite_code) // 复制内容，必须字符串，数字需要转换为字符串
				const result = h5Copy(text)
				if (result === false) {
					uni.showToast({
						title:'不支持',
						icon:'none'
					})
				} else {
					uni.showToast({
						title:'复制成功',
						icon:'none'
					})
				}
			},
			event(item){
				uni.navigateTo({
					url:"../orderlist/orderlist"
				})
			},
			preview(){
				let urlimgs = []
				urlimgs.push(this.qrcode)
				uni.previewImage({
					urls: urlimgs,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			// preview(urlimg){
			// 	let urlimgs=[]
			// 	urlimgs.push(this.qrcode)
			// 	uni.previewImage({
			// 		urls: urlimgs,
			// 		longPressActions: {
			// 			itemList: ['发送给朋友', '保存图片', '收藏'],
			// 			success: function(data) {
			// 				console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
			// 			},
			// 			fail: function(err) {
			// 				console.log(err.errMsg);
			// 			}
			// 		}
			// 	});
			// }
		},
		onShow:function(){
			
			// this.topath()
		}
	}
</script>

<style>
page{
	background-color: #e8edf7;
}
.qrcode_box{
	position:relative;
	width:500upx;
	height:500upx;
	background-image: linear-gradient(#3a86ff , #145ed3);
	margin-left:125upx;
	top:75upx;
	border-radius:20upx;
}
.qrcode_bg{
	position:absolute;
	width:300upx;
	height:300upx;
	margin-left:100upx;
	margin-top:50upx;
	background-color:#FFFFFF;
	border-radius:20upx;
	line-height:300upx;
}
.invite_code{
	position:absolute;
	width:500upx;
	height:105upx;
	margin-top:375upx;
}
.invite_code text{
	color:#FFFFFF;
}
.dot{
	position:absolute;
	width:500upx;
	height:2upx;
	text-align:center;
	line-height:2upx;
	margin-top:479upx;
}
.dot text{
	color:#FFFFFF;
	width:500upx;
	height:2upx;
	line-height:2upx;
	font-size:60upx;
	letter-spacing:10upx;
}
.qrcode_text{
	width:500upx;
	height:200upx;
	margin-top:75upx;
	background-color:#145ed3;
	border-radius:20upx;
	margin-left:125upx;
	display:flex;
	align-items:center;
}
.qrcode_text text{
	color:#FFFFFF;
	margin:auto 50upx;
}
.button{
	width:700upx;
	height:200upx;
	margin:25upx;
	display:flex;
	align-items:center;
	justify-content:center;
}
.button_view{
	width:250upx;
	height:80upx;
	color:#FFFFFF;
	display:flex;
	align-items:center;
	border-radius:50upx;
	margin:auto 25upx;
}
.save{
	background-color:#52c41a;
}
.invite{
	background-color:#145ed3;
}
.button_view text{
	margin:auto;
}
</style>
